// 绑定单位
<template>
    <f7-page class="hntsh">
        <f7-navbar>
            <f7-nav-left v-if="models.model.auditStatus != 2">
                <f7-link @click="handleBack" icon-material="chevron_left" force></f7-link>
            </f7-nav-left>
            <f7-nav-left v-else>
                <f7-link v-if="!$util.isUmSdk()">
                    <img
                        width="22"
                        @click="openSidebar"
                        src="../../../../assets/img/qzjx/sidebar.svg"
                        alt=""
                    />
                </f7-link>
            </f7-nav-left>
            <f7-nav-title>绑定单位</f7-nav-title>
            <f7-nav-right> </f7-nav-right>
        </f7-navbar>
        <div class="content-list">
            <div class="content-box">
                <div class="total-top">
                    <section>
                        <img
                            width="28"
                            src="@/assets/img/quality/sample-icon-title.png"
                            alt=""
                        />
                        <div class="total-top-right">
                            <div class="code">{{ info.model.enterpriseName }}</div>
                            <div class="tags-box">
                                <span
                                    class="tag"
                                    v-for="(item, index) in info.entTypes"
                                    :key="index"
                                    >{{ item.enterpriseTypeName }}</span
                                >
                            </div>
                        </div>
                    </section>
                    <section @click="changeEnterprise" v-if="pageAction == 'edit'">
                        <img src="../../../../assets/img/qzjx/change.png" alt="">
                        <span>切换</span>
                    </section>
                </div>
                <div class="total-bottom">
                    <div class="name-box">
                        统一社会信用代码：{{ info.model.creditCode }}
                    </div>
                    <div>单位地址：{{ info.model.regAddress }}</div>
                </div>
            </div>
            <v-accordion
                :title="pageAction == 'create' ? '人员信息' : '申请信息'"
                class="infoList"
            >
                <van-form input-align="right" ref="form" :readonly="isWrite">
                    <van-field
                        v-model="models.model.personType"
                        readonly
                        required
                        label="人员类型"
                    >
                        <div slot="input" class="input-cell">
                            <v-picker-div
                                placeholder="请选择"
                                :columns="controlData.personTypeEnum"
                                :assignment="models.model"
                                :defCheck="models.model.personType"
                                code="personType"
                                :disabled="isWrite"
                                :rules="[
                                    {
                                        required: true,
                                        message: '请输入正确内容',
                                    },
                                ]"
                            >
                            </v-picker-div>
                        </div>
                    </van-field>
                    <van-field
                        v-model="models.model.personName"
                        required
                        label="姓名"
                        :rules="[{ required: true, message: '请输入正确内容' }]"
                        rows="1"
                        autosize
                        type="textarea"
                        placeholder="请输入"
                    >
                    </van-field>
                    <van-field
                        v-model="models.model.personIdcard"
                        label="身份证号"
                        required
                        rows="1"
                        autosize
                        type="textarea"
                        :rules="[
                            { validator: cardRegex, message: '请输入正确内容' },
                        ]"
                        placeholder="请输入"
                    >
                    </van-field>
                    <van-field
                        v-model="models.model.personMobile"
                        label="手机号"
                        required
                        readonly
                        type="number"
                        :rules="[
                            {
                                validator: mobileRegex,
                                message: '请输入正确内容',
                            },
                        ]"
                        placeholder="请输入"
                    >
                    </van-field>
                    <van-field
                        v-if="pageAction != 'create'"
                        v-model="models.model.createTime"
                        label="申请时间"
                        rows="1"
                        autosize
                        type="textarea"
                        placeholder="请输入"
                    >
                    </van-field>
                    <!-- <van-field
                        readonly
                        required
                        class="label-all file"
                        name="datetimePicker"
                        label="人员正脸照"
                    />
                    <div>
                        <qm-file-upload
                            ref="facePic"
                            :galleryOptions="{ multiple: true, maximum: 9 }"
                            :disabled="isWrite"
                            :params="{
                                type: 'attach',
                                dataKey: models.model.caseId,
                                bizType: 'PERSON_PHOTO',
                            }"
                            uploadId="file1"
                            extensions="jpg,jpeg,png"
                        >
                        </qm-file-upload>
                    </div>
                    <van-field
                        readonly
                        required
                        class="label-all file"
                        name="datetimePicker"
                        label="社保证明"
                    />
                    <div>
                        <qm-file-upload
                            ref="ReturnPic"
                            :galleryOptions="{ multiple: true, maximum: 9 }"
                            :disabled="isWrite"
                            :params="{
                                type: 'attach',
                                dataKey: models.model.caseId,
                                bizType: 'SOCIAL_SECURITY_CERT',
                            }"
                            uploadId="file2"
                            extensions="jpg,jpeg,png"
                        >
                        </qm-file-upload>
                    </div> -->
                </van-form>
            </v-accordion>
            <v-accordion
                title="审核信息"
                class="infoList"
                v-if="pageAction != 'create'"
            >
                <van-form input-align="right" ref="form1">
                    <van-field
                        v-model="models.model.auditStatus"
                        label="审核结果"
                        rows="1"
                        autosize
                        readonly
                        type="textarea"
                        placeholder="请输入"
                    >
                        <div slot="input" class="input-cell">
                            {{ statusText(models.model.auditStatus) }}
                        </div>
                    </van-field>
                    <van-field
                        v-model="controlData.auditInfo.opinionText"
                        label="备注"
                        rows="1"
                        autosize
                        readonly
                        type="textarea"
                        placeholder="--"
                    >
                    </van-field>
                    <van-field
                        v-model="controlData.auditInfo.assigneeName"
                        label="审核人"
                        rows="1"
                        autosize
                        type="textarea"
                        readonly
                        placeholder="--"
                    >
                    </van-field>
                    <van-field
                        v-model="controlData.auditInfo.finishTime"
                        label="审核时间"
                        rows="1"
                        autosize
                        type="textarea"
                        readonly
                        placeholder="--"
                    >
                    </van-field>
                </van-form>
            </v-accordion>
            <f7-toolbar
                position="bottom"
                no-shadow
                class="fff"
                v-if="
                    models.model.auditStatus != 3 ||
                    models.model.auditStatus != -1
                "
            >
                <f7-button
                    fill
                    class="submit-btn"
                    @click="sure()"
                    v-if="!isWrite"
                    >提交</f7-button
                >
                <f7-button
                    fill
                    class="submit-btn"
                    @click="comeBack()"
                    v-if="models.model.auditStatus == 2"
                    >撤销，重新绑定</f7-button
                >
            </f7-toolbar>
        </div>
        <van-popup v-model="show" position="bottom" get-container="body" >
            <list></list>
        </van-popup>
    </f7-page>
</template>

<script>
import controller from '@/libs/framework/workflowController'
import list from './list.vue'
export default class instance extends controller {
    onBeforeInit() {
        this.urls = {
            model: '/app/ent/entPersonCase/workflow/getWorkflowViewModel',
            save: '/app/ent/entPersonCase/workflow/processRun',
        }
    }
    onInit() {}
    onBeforeQuery (type, conditions, params) {
        // if (type == 'list') {
        //     if(this.context.workParams){
        //         Object.keys(this.context.workParams).forEach(key=>{
        //             params[key]=this.context.workParams[key]
        //         })
        //     }
        // }
    }
    onAfterQuery(type, isSuccess, result) {
        if (!result.models.model.enterpriseId||this.$f7route.query.enterpriseId) {
            result.models.model.enterpriseId = this.$f7route.query.enterpriseId
        }
        if (
            result.controlData.personTypeEnum &&
            result.controlData.personTypeEnum.length > 0
        ) {
            result.controlData.personTypeEnum.forEach((element) => {
                element.code = element.value
                element.name = element.key
            })
        }
        // 默认设置人员类型为现场作业人员
        if (!result.models.model.personType) result.models.model.personType = 2
        this.vm.getData(result.models.model.enterpriseId)
        this.vm.caseId=result.models.model.caseId
        return result
    }

    onAfterSave(isSuccess, result) {
        if (isSuccess) {
            // this.$f7.views.current.router.navigate(
            //     `/business/qzjx/bindUnit/index`
            // )
            this.vm.getWorkFlowData(result)
        }
    }

    mixin() {
        return {
            components: {
                list
            },
            data() {
                return {
                    show:false,
                    controlData: {
                        auditInfo: {},
                    },
                    models: {
                        model: {},
                    },
                    pageAction: '',
                    info: {
                        entTypes: [],
                        model: {},
                    },
                    selectUser: {
                        selectComment: null,
                        comment: null,
                        comments: [],
                        tran: [],
                        activity: '',
                        users: [],
                    },
                    workParams:{},
                    caseId:'',
                }
            },
            computed: {
                isWrite() {
                    var isWrite = false
                    if (
                        this.models.model.auditStatus == 2 ||
                        this.models.model.auditStatus == 3
                    ) {
                        isWrite = true
                    }
                    return isWrite
                },
            },
            mounted() {
                
            },
            methods: {
                // 切换单位
                changeEnterprise(){
                    // this.show=true
                    let url=window.location.href
                    let split=url.split('?')
                    this.$f7.views.current.router.navigate(`/business/qzjx/bindUnit/list?${split[1]}`);
                },
                handleBack(){
                    this.$f7.views.current.router.back({force:true})
                    this.workParams={}
                },
                getWorkFlowData(r){
                    let formId=r.parameters.formId||this.caseId
                    this.$f7.preloader.show();
                    this.$framework.util
                    .getPromise(`/app/workflow/getWorkflowArgs`, { formId })
                    .then(res => {
                        if (!res.pageAction || !res.assigneeId) {
                            this.$f7.preloader.hide();
                            return;
                        }
                        let params = {
                            pageAction: res.pageAction,
                            assigneeId: res.assigneeId,
                            action:res.pageAction=='edit'?'processEdit':'processView',
                        };
            
                        if (res.pageAction === 'view') {
                            Object.assign(params, { historyTaskId: res.historyTaskId })
                        } else {
                            Object.assign(params, { taskId: res.taskId })
                        }
                        this.workParams=params
                        this.$framework.util
                        .getPromise(`/ent/entPersonCase/workflow/getWorkflowViewModel`, { ...params })
                        .then(r=>{
                            this.models=r.models
                            this.controlData=r.controlData
                            if (
                                r.controlData.personTypeEnum &&
                                r.controlData.personTypeEnum.length > 0
                            ) {
                                r.controlData.personTypeEnum.forEach((element) => {
                                    element.code = element.value
                                    element.name = element.key
                                })
                            }
                            // 默认设置人员类型为现场作业人员
                            if (!r.models.model.personType) r.models.model.personType = 2
                            this.$f7.preloader.hide();
                        }).catch(e=>{
                            this.$f7.preloader.hide();
                        })
                    })
                    .catch(err => {
                        this.$f7.preloader.hide();
                    })
                    .finally(() => {});
                },
                openSidebar() {
                    if (window.qmsdk) {
                        window.qmsdk.openSidebar()
                    } else if (this.isUmSdk) {
                        umSdk.preRefresh({
                            type: 1, // 0刷新 1不刷新
                            step: 0, // 返回上第几页，默认0
                            success: function () {},
                            fail: function (err) {},
                        })
                    } else {
                        this.$f7router.navigate(`/ui/set/index`)
                    }
                },
                statusText(val) {
                    if (val == 2) {
                        return '待审核'
                    } else if (val == 3) {
                        return '审核通过'
                    } else {
                        return '审核不通过'
                    }
                },
                getData(enterpriseId) {
                    this.$f7.request.post(
                        `/app/ent/entBase/getEntity`,
                        {
                            pageAction: 'edit',
                            enterpriseId: enterpriseId,
                        },
                        (r) => {
                            r = JSON.parse(r)
                            if (r && r.success) {
                                this.info = r.models
                                this.models.model.enterpriseName=r.models.model.enterpriseName
                            } else {
                                this.$toast(r.message || '网络错误，请稍后重试')
                            }
                        }
                    )
                },
                mobileRegex(val) {
                    if (!val) {
                        return false
                    } else {
                        return /^0{0,1}(13[0-9]|14[01456789]|15[012356789]|16[2567]|17[012345678]|18[0-9]|19[012356789])[0-9]{8}$/.test(
                            val
                        )
                    }
                },
                cardRegex(val) {
                    if (!val) {
                        return false
                    }
                    let _IDRe18 =
                        /^([1-6][1-9]|50)\d{4}(18|19|20)\d{2}((0[1-9])|10|11|12)(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
                    let _IDre15 =
                        /^([1-6][1-9]|50)\d{4}\d{2}((0[1-9])|10|11|12)(([0-2][1-9])|10|20|30|31)\d{3}$/
                    if (_IDRe18.test(val) || _IDre15.test(val)) {
                        return true
                    } else {
                        return false
                    }
                },
                //提交
                sure() {
                    this.models.caseId = this.models.model.caseId
                    var self = this
                    // if (self.$refs.facePic.getUploadedCount() < 1) {
                    //     self.$toast('请上传人员正脸照')
                    //     return false
                    // }
                    // if (self.$refs.ReturnPic.getUploadedCount() < 1) {
                    //     self.$toast('请上传社保证明')
                    //     return false
                    // }
                    self.$refs.form
                        .validate()
                        .then((_) => {
                            this.super.send('',false)
                            // this.$f7.request.post(
                            //     `/gwc/many/saveManyByOne`,
                            //     {
                            //         models: this.models,
                            //     },
                            //     (r) => {
                            //         r = JSON.parse(r);
                            //         if (r && r.success) {
                            //             this.$f7.dialog.toast("入仓成功");
                            //             if (index == 1) {
                            //                 this.$f7.views.current.router.back();
                            //             } else {
                            //                 this.$f7router.navigate(`/base/barcodeScan/`);
                            //             }
                            //         } else {
                            //             this.$toast(r.message || "网络错误，请稍后重试");
                            //         }
                            //     }
                            // );
                        })
                        .catch((err) => {
                            console.log(err)
                        })
                },
                //撤销
                comeBack() {
                    this.$f7.dialog.confirm('确定要撤回吗', (confirm) => {
                        if (confirm) {
                            this.$f7.preloader.show()
                            this.$util
                                .request(
                                    `/app/ent/entPersonCase/workflow/processRollback`,
                                    {
                                        appCode: 'personCaseBind',
                                        historyTaskId:
                                            this.$f7route.query.historyTaskId,
                                        caseId: this.models.model.caseId,
                                        pageAction: 'view',
                                    },
                                    'post'
                                )
                                .then((res) => {
                                    this.$f7.preloader.hide()
                                    if (res.data.success) {
                                        this.$f7.dialog.alert(
                                            '撤销成功',
                                            () => {
                                                // this.$f7.views.current.router.back();
                                                this.$f7.views.current.router.navigate(
                                                    `/business/qzjx/bindUnit/index`
                                                )
                                            }
                                        )
                                    } else {
                                        this.$f7.dialog.alert('撤销失败')
                                    }
                                })
                                .catch((err) => {
                                    this.$f7.preloader.hide()
                                    this.$f7.dialog.alert('撤销失败')
                                    throw err
                                })
                        }
                    })
                },
            },
        }
    }
}
</script>

<style lang="less" scoped>
@import '~@/assets/css/qualityCreate.less';
@deep: ~'>>>';

@{deep} .page-content {
    padding-top: 0;
}

@{deep} .van-popup {
    background-color: #f0f2f5;
}

@{deep} .van-swipe-cell__right {
    display: flex;
}

.hntsh {
    @{deep}.accordion .item-content {
        border-bottom: 1px solid #e3e5e9;
    }

    .content-list {
        padding: 44px 0 50px;
    }

    @{deep} .pic_upload {
        padding-top: 10px;
    }

    @{deep} .toolbar,
    @{deep}.navbar {
        position: fixed;
    }

    .tip {
        color: #fc3a39;
        background-color: rgba(252, 58, 57, 0.1);
        padding: 4px;
        margin: 5px 10px;
    }
}

.content-box {
    padding: 12px 16px;
    margin-bottom: 10px;
    font-size: 13px;
    background: #fff;
    

    .total-top {
        display: flex;
        align-items: flex-start;

        .total-top-right {
            margin-left: 10px;
        }
        section{
            &:nth-child(1){
                display: flex;
                align-items: center;
                flex: 1;
            }
            &:nth-child(2){
                flex-shrink: 0;
                display: flex;
                align-items: flex-start;
                justify-content: center;
                color: #1990FF;
                font-size: 14px;
                img{
                    width: 15px;
                    margin-top: 2px;
                    margin-right: 3px;
                }
            }
        }
    }

    .total-top,
    .total-middle {
        margin-bottom: 10px;

        .code,
        .tag-box .number {
            font-weight: 600;
            color: #242424;
            font-size: 14px;
        }

        .number {
            font-size: 12px;
            color: #909db6;
            font-weight: 400;
        }

        .tag {
            border-radius: 2px;
            color: #61677a;
            border-color: rgba(115, 125, 138, 0.1);
            background-color: rgba(115, 125, 138, 0.1);
            margin-top: 4px;
            display: inline-block;
        }
    }

    .total-bottom {
        font-size: 14px;
        font-weight: 400;
        color: #8995ac;

        .name-box {
            margin-bottom: 5px;
        }
    }
}
</style>
